<template>
    <div>
         <el-drawer
            title="获取代码"
            :visible.sync="drawer"
            :before-close="handleClosecode"
            custom-class="demo-drawer"
            ref="drawer"
             size="90%">
              <div class="demo-drawer__content">
                    <div class="demo-drawer__content_from">
                        <div class="from">
                            <div class="codefrombox">
                                <div class="tabbox">
                                    <span :class="typeindex==1?'tab on':'tab'" @click="tab(1)">两段式JS</span>
                                    <span :class="typeindex==2?'tab on':'tab'" @click="tab(2)">一段式JS</span>
                                </div>
                                <!-- 两段式JS -->
                                <div v-show="typeindex==1">  
                                    <div class="p_"><span>优点：</span>JS请求次数少，执行效率高。</div>
                                    <div class="p_"><span>投放方法：</span>
                                    代码位的&lt;head&gt;代码粘贴到网页的&lt;head&gt;&lt;head/&gt;中， 代码位的&lt;body&gt;代码粘贴到网页的&lt;body&gt;&lt;body/&gt;中。</div>
                                    <div class="tips"><span>?</span>如果您的网站修改了document.domain，请先完成跨域策略设置。 </div>
                                    <div class="box_">
                                        <div class="p_bt">&lt;head&gt;代码 </div>
                                        <div class="codebox">
                                            <pre><code>
                                                    &lt;!-- 请置于所有广告位代码之前 --&gt;
                                            </code></pre>
                                        </div>
                                        <div class="p_bt">&lt;head/&gt;</div>
                                    </div>
                                    <div class="box_">
                                        <div class="p_bt">&lt;body&gt;代码: <span>请粘贴到广告位所在位置</span></div>
                                        <div class="codebox">
                                            <pre><code>
                                                &lt;!-- {{item.name}}--&gt;
                                                &lt;script&gt; img100({{item.id}}); &lt;/script &gt;
                                            </code></pre>
                                        </div>
                                        <div class="p_bt"> &lt;body/&gt;</div>
                                    </div>
                                </div>
                                <!-- 一段式JS -->
                                <div  v-show="typeindex==2">
                                    <div class="p_"><span>优点：</span>投放简单方便，支持JS调用。</div>
                                    <div class="p_"><span>投放方法：</span>
                                        直接投放，请将代码粘贴到广告位所在的位置。通过JS调用，请在JS文件中使用document.write()方法写入代码。
                                    </div>
                                    <div class="tips"><span>?</span>如果您的网站修改了document.domain，请先完成跨域策略设置。 </div>
                                    <div class="box_">
                                        <div class="p_bt">&lt;body&gt;代码: <span>请粘贴到广告位所在位置</span></div>
                                        <div class="codebox">
                                            <pre><code>
                                                &lt;!-- {{item.name}}--&gt;
                                                &lt;script&gt; img100({{item.id}}); &lt;/script &gt;
                                            </code></pre>     
                                        </div>
                                        <div class="p_bt"> &lt;body/&gt;</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="demo-drawer__footer">
                            <el-button @click="handleClosecode">取 消</el-button>
                        </div>
                    </div>
                </div>
         </el-drawer>
    </div>
</template>
<script>
// 获取代码
// import{init}from'https://now.bdstatic.com/stash/v1/ba4947d/ai-docs-bot/2d539a9/sdk/ai-docs-bot-1.3.0-beta.1.js';
export default {
    name:'drawer_Code',
    data(){
        return{
            typeindex:1,
        }
    },
    props:{
        drawer:{
            type: Boolean,
            default:false,
        },
        item:{
            // type: Object,
            // required: true,
        }
    },
    mounted(){
    },
    watch:{
    //    item(){
    //     }
    },
    methods:{
        handleClosecode(){
            // this.drawer=false;
          this.$emit("handleClosecode",this.drawer)
        },
        tab(i){
            this.typeindex=i;
        }
    }
}
</script>